/*
 * @Author: 田鑫
 * @Date: 2023-03-05 18:14:16
 * @LastEditors: 田鑫
 * @LastEditTime: 2023-03-05 19:23:48
 * @Description:
 */
import Unocss from 'unocss/vite';
import {
  presetUno,
  presetIcons,
  presetAttributify,
  transformerDirectives,
  transformerCompileClass,
  transformerVariantGroup,
  transformerAttributifyJsx,
} from 'unocss';
import presetRemToPx from '@unocss/preset-rem-to-px';

export const configUnocss = () =>
  Unocss({
    presets: [presetUno(), presetIcons(), presetAttributify(), presetRemToPx()],
    transformers: [
      transformerDirectives(),
      transformerCompileClass(),
      transformerVariantGroup(),
      transformerAttributifyJsx(),
    ],
    shortcuts: [
      // 垂直水平居中
      ['flex-center', 'flex justify-center items-center'],
    ],
    rules: [
      [/^mgl-(\d+)$/, ([, d]) => ({ 'margin-left': `${d}px !important` })],
      [/^mgr-(\d+)$/, ([, d]) => ({ 'margin-right': `${d}px !important` })],
      [/^mgt-(\d+)$/, ([, d]) => ({ 'margin-top': `${d}px !important` })],
      [/^mgb-(\d+)$/, ([, d]) => ({ 'margin-bottom': `${d}px !important` })],
      [/^pd-(\d+)$/, ([, d]) => ({ padding: `${d}px !important` })],
      [/^flex-(\d+)$/, ([, d]) => ({ flex: `${d} !important` })],
      [/^w(\d+)$/, ([, d]) => ({ width: `${d}% !important` })],
      [/^w-(\d+)$/, ([, d]) => ({ width: `${d}px !important` })],
      [/^h-(\d+)$/, ([, d]) => ({ height: `${d}px !important` })],
      [/^ft-(\d+)$/, ([, d]) => ({ 'font-size': `${d}px !important` })],
      [
        'box-container',
        {
          'border-radius': '2px',
          padding: '20px',
          margin: '8px',
          'background-color': '#fff',
        },
      ],
      [
        'justify-between',
        {
          'justify-content': 'space-between',
        },
      ],
      ['align-center', { 'text-align': 'center' }],
    ],
  });
